<template>
  <el-dialog title="预警描述" :visible.sync="dialogVisible" width="45%">
    <div class="data_info">
      <el-table :data="dataItem">
        <el-table-column property="recordMesge" label="预警信息"></el-table-column>
        <el-table-column property="remarks" label="备注"></el-table-column>
      </el-table>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { waterWarningRecordById } from '@/api/other'
export default {
  data() {
    return {
      dialogVisible: false,
      dataItem: [],
    }
  },
  methods: {
    init(id) {
      this.dialogVisible = true
      waterWarningRecordById({ id }).then((res) => {
        const { code, data, msg } = res
        if (code !== '0000') return this.$message.error(msg)
        this.dataItem = data
      })
    },
  },
}
</script>

<style lang='scss' scoped>
.data_info {
  height: 500px;
  overflow: auto;
}
</style>
